<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <title>Flying Saucer: XHTML Forms Support</title>
    <link rel="stylesheet" type="text/css" href="general.css" title="Style" media="screen" />
    <link rel="stylesheet" type="text/css" href="print.css" title="Style" media="print" />
  </head>
  <body>
    <p class="link left-link"><a href="demoNav:back">Previous Page</a></p>
    <p class="link right-link"><a href="demoNav:forward">Next Page</a></p>
    <p id="fslogo">Flying Saucer XML/CSS2 Renderer</p>
    <span id="pagebyline">XHTML Forms Support</span>
    <br />
      <p><b>Forms support includes</b>: Any XML/XHTML element can be "replaced" during the rendering cycle with a component
      that knows how to draw itself. This means we can replace XHTML form elements with, for example, Swing components. It also
      allows us to replace SVG tags with rendered SVG images, and so on. This page shows how a XHTML form is rendered via Swing;
      one could also use another GUI toolkit for Java (AWT, Thinlet, etc). FS doesn't currently support form submission out of
      the box, but it can be added--the Swing components replaced in the page are just normal Swing components to which listeners
      can be attached. Note that as with HTML, you can freely mix formatted text, images and CSS formatting with form elements.</p>
    <br />
    <h3>Example Form Components</h3>
    <form action="">
        <input type="hidden" name="MyHiddenField" value="This should be hidden, but its not at the moment!"/>
        <table>
            <tbody>
            <tr><td>First Name:</td><td><input type="text" name="FirstName" value=""/></td></tr>
            <tr><td>Last Name:</td><td><input type="text" name="LastName" value=""/></td></tr>
            <tr><td>Address:</td><td><input type="text" name="AddressLine1" value=""/></td></tr>
            <tr><td>Address (cont.):</td><td><input type="text" name="AddressLine2" value="Suite D" readonly="readonly"/></td></tr>
            <tr><td>City:</td><td><input type="text" name="City" value=""/></td></tr>
            <tr>
            	<td>State:</td>
            	<td>
            		<select name="State">
						<option value="">-- Select --</option>
						<option value="AL">Alabama</option>
						<option value="AK">Alaska</option>
						<option value="AZ">Arizona</option>
						<option value="AR">Arkansas</option>
						<option value="CA">California</option>
						<option value="CO">Colorado</option>
						<option value="CT">Connecticut</option>
						<option value="DE">Delaware</option>
						<option value="DC">District of Columbia</option>
						<option value="FL">Florida</option>
						<option value="GA">Georgia</option>
						<option value="HI">Hawaii</option>
						<option value="ID">Idaho</option>
						<option value="IL">Illinois</option>
						<option value="IN">Indiana</option>
						<option value="IA">Iowa</option>
						<option value="KS">Kansas</option>
						<option value="KY">Kentucky</option>
						<option value="LA">Louisiana</option>
						<option value="ME">Maine</option>
						<option value="MD">Maryland</option>
						<option value="MA">Massachusetts</option>
						<option value="MI">Michigan</option>
						<option value="MN">Minnesota</option>
						<option value="MS">Mississippi</option>
						<option value="MO">Missouri</option>
						<option value="MT">Montana</option>
						<option value="NE">Nebraska</option>
						<option value="NV">Nevada</option>
						<option value="NH">New Hampshire</option>
						<option value="NJ">New Jersey</option>
						<option value="NM">New Mexico</option>
						<option value="NY">New York</option>
						<option value="NC">North Carolina</option>
						<option value="ND">North Dakota</option>
						<option value="OH">Ohio</option>
						<option value="OK">Oklahoma</option>
						<option value="OR">Oregon</option>
						<option value="PA">Pennsylvania</option>
						<option value="RI">Rhode Island</option>
						<option value="SC">South Carolina</option>
						<option value="SD">South Dakota</option>
						<option value="TN">Tennessee</option>
						<option value="TX">Texas</option>
						<option value="UT">Utah</option>
						<option value="VT">Vermont</option>
						<option value="VA">Virginia</option>
						<option value="WA">Washington</option>
						<option value="WV">West Virginia</option>
						<option value="WI">Wisconsin</option>
						<option value="WY">Wyoming</option>
					</select>
            	</td>
            </tr>
            <tr><td>Zip:</td><td><input type="text" name="ZipCode" size="5" maxlength="5" /></td></tr>
            <tr>
            	<td>Interests:<br /><i>(Select all that apply)</i></td>
            	<td>
            		<select name="Interests" multiple="true" size="8">
            			<option value="1">Meeting new people</option>
            			<option value="2">Networking</option>
            			<option value="3">Romance</option>
            			<option value="4">A lucrative book deal</option>
            			<option value="5" selected="selected">Writing Java code</option>
            		</select>
            	</td>
            </tr>
            <tr>
            	<td>Favorite Band:</td>
            	<td>
            		<select name="FavoriteBand" size="8">
            			<option value="1">The Beatles</option>
            			<option value="2">U2</option>
            			<option value="3">The Rolling Stones</option>
            			<option value="4">Pearl Jam</option>
            			<option value="5">Phish</option>
            			<option value="6">Coldplay</option>
            		</select>
            	</td>
            </tr>
            <tr>
            	<td>Contact method:</td>
            	<td>
            		<input type="radio" name="ContactMethod" value="Mail" />&#160;Mail<br />
            		<input type="radio" name="ContactMethod" value="E-mail" />&#160;E-mail
            	</td>
            </tr>
            <tr>
            	<td>Preferred e-mail format:</td>
            	<td>
            		<input type="radio" name="EmailFormat" value="None" checked="checked" />&#160;No Preference<br />
            		<input type="radio" name="EmailFormat" value="Plain" />&#160;Plain Text<br />
            		<input type="radio" name="EmailFormat" value="HTML" />&#160;XHTML
            	</td>
            </tr>
            <tr>
            	<td>Chosen Username:</td>
            	<td><input type="text" name="Username" />&#160;<input type="button" name="CheckButton" value="Available?" disabled="disabled" /></td>
            </tr>
            <tr>
            	<td>Password:</td>
            	<td><input type="password" name="Password" /></td>

            </tr>
            <tr>
            	<td>Confirm Password:</td>
            	<td><input type="password" name="ConfirmPassword" /></td>
            </tr>
            <tr><td colspan="2">Comments:</td></tr>
            <tr><td colspan="2"><textarea name="Comments" rows="6" cols="45" /></td></tr>
            <tr><td colspan="2">Delivery Instructions:</td></tr>
            <tr><td colspan="2"><textarea name="Instructions" rows="3" cols="45" /></td></tr>
            <tr><td colspan="2"><input type="checkbox" name="SendMail" value="1" />&#160;Yes, I would like to be included on your mailing list.</td></tr>
            <tr><td colspan="2"><input type="checkbox" name="FreeCash" value="1" checked="checked" />&#160;Yes, send me a wad of free cash!</td></tr>
            <tr><td colspan="2" align="right"><input type="reset" name="ResetForm" value="Clear"/>&#160;<input type="submit" name="FormPosted" value="Register!"/></td></tr>
            </tbody>
        </table>
    </form>
  </body>
</html>

